<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>用户列表</title>
    <link href="../css/bootstrap.min.css" rel="stylesheet">
    <link href="../css/materialdesignicons.min.css" rel="stylesheet">
    <link href="../css/style.min.css" rel="stylesheet">
    <script src="../js/jquery-1.11.0.min.js"></script>
    <script>
        $(function () {
            load();
            $("#deleteUsers").click(function () {
                if (confirm("确认删除这些用户吗？")){
                    var uids;
                    if (true){
                        //1.添加判断状态
                        $.each($(".itemSelect"), function () {
                            if ($(this).is(':checked')){
                                uids = $(this).val();
                                $.post("/music/admin/deleteUsers",{uids:uids},function () {
                                },"json");
                            }
                        });
                        location.href = "user_list.html";
                    }
                }
            });
            $("#open").click(function () {
                if (confirm("确认取消这些用户禁言吗？")){
                    var uids;
                    if (true){
                        //1.添加判断状态
                        $.each($(".itemSelect"), function () {
                            if ($(this).is(':checked')){
                                uids = $(this).val();
                                $.post("/music/admin/open",{uids:uids},function () {
                                },"json");
                            }
                        });
                        location.href = "user_list.html";
                    }
                }
            });
            $("#updateComments").click(function () {
                if (confirm("确认禁言这些用户吗？")){
                    var uids;
                    if (true){
                        //1.添加判断状态
                        $.each($(".itemSelect"), function () {
                            if ($(this).is(':checked')){
                                uids = $(this).val();
                                $.post("/music/admin/updatecomments",{uids:uids},function () {
                                },"json");
                            }
                        });
                        location.href = "user_list.html";
                    }
                }
            });
        });



        function load(currentPage) {
            //1.根据cid加载路线列表数据
            $.post("/music/admin/findPage",
                {currentPage: currentPage},//动态值
                function (data) {
                    $navul = $("#navul");
                    //首页不变
                    var lis = '';
                    //拼接8个导航栏
                    for (var i = 0; i < data.list.length; i++) {
                        lis += '<tr>+<td>' +
                            '<label class="lyear-checkbox checkbox-primary">' +
                            '<input type="checkbox" name="uids" value="'+data.list[i].uid+'"' +
                            'id="'+data.list[i].uid+'" class="itemSelect"><span></span>' +
                            '</label>' +
                            '</td>' +
                            '<td>' + (i + 1) + '</td>' +
                            '<td>' + data.list[i].username + '</td>' +
                            '<td>' + data.list[i].userpassword + '</td>' +
                            '<td>' + data.list[i].email + '</td>' +
                            '<td>' + data.list[i].sex + '</td>' +
                            '<td>' + data.list[i].telephone + '</td>' +
                            '<td>' + data.list[i].vipstatus + '</td>' +
                            '<td>' + data.list[i].vipcode + '</td>' +
                            '<td>' +
                            data.list[i].commentstatus +
                            '</td>' +
                            '<td>' +
                            '<div class="btn-group">' +
                            '<a class="btn btn-xs btn-default" title="禁言" href="javascript:updateComment('+data.list[i].uid+');">禁言</a>' +
                            '<a class="btn btn-xs btn-default" title="删除" href="javascript:deleteUser('+data.list[i].uid+');">删除</a>' +
                            '</div>' +
                            '</td>' + '</tr>';
                    }
                    lis += '</tbody>';
                    $navul.html(lis);
                    $("#totalCountSpan").html(data.totalCount);
                    $("#totalPageSpan").html(data.totalPage);
                    //4. 页面处理 - 前5后4
                    //4.1 开始页数= 当前页数 - 5
                    var start = data.currentPage - 5;
                    //4.2 结束页数= 当前页数 + 4
                    var end = data.currentPage + 4;
                    //4.3 判断 前面不足5个的情况
                    if (start < 1) {
                        start = 1;
                        end = 10;
                    }
                    //4.4 判断 后面不足4的情况
                    if (end > data.totalPage) {
                        end = data.totalPage;
                        start = end - 9;
                    }
                    //4.5 总页数不足10页
                    if (data.totalPage < 10) {
                        start = 1;
                        end = data.totalPage;
                    }
                    //4.6拼接ul - li
                    $pageUl = $("#pageUl");
                    //首页  cid = 3
                    var pageList = '<li><a href="javaScript:load(1)">首页</a></li>';
                    //上一页
                    var prePage = data.currentPage - 1;
                    if (prePage < 1) {
                        prePage = 1;
                    }
                    pageList += '<li>' +
                        '<a href="javaScript:load(' + prePage + ')">上一页</a></li>';
                    //拼接 页码 从start开始 end 结束
                    for (var i = start; i <= end; i++) {
                        if (i == data.currentPage) {
                            pageList += '<li onclick="load(' + i + ')" class="active"><a href="javaScript:;">' + i + '</a></li>';
                        } else {
                            pageList += '<li onclick="load(' + i + ')" ><a href="javaScript:;">' + i + '</a></li>';
                        }
                    }
                    //下一页
                    var nextPage = data.currentPage + 1;
                    if (nextPage > data.totalPage) {
                        nextPage = data.totalPage;
                    }
                    pageList += '<li onclick="load(' + nextPage + ')" ><a href="javascript:;">下一页</a></li>';
                    //末页
                    pageList += '<li onclick="load(' + data.totalPage + ')" ><a href="javascript:;">末页</a></li>';

                    //4.7 将pageList添加到ul中
                    $pageUl.html(pageList);
                },
                "json");
        }
        function deleteUser(uid){
            if (confirm("确认删除该用户吗？")){
                $.post("/music/admin/deleteUser",{uid:uid},function (data){
                    location.href="user_list.html";
                });
            }
        }
        function updateComment(uid){
            if (confirm("确认禁言该用户吗？")){
                $.post("/music/admin/updatecomment",{uid:uid},function (data){
                    location.href="user_list.html";
                })
            }
        }
    </script>
</head>
<body>
<div class="lyear-layout-web">
    <div class="lyear-layout-container">
        <!--左侧导航-->
        <aside class="lyear-layout-sidebar">
            <!-- logo -->
            <div id="logo" class="sidebar-header">
                <h1 style="text-align: center;color: #33cabb;">松林音乐</h1>
            </div>
            <div class="lyear-layout-sidebar-scroll">

                <nav class="sidebar-main">
                    <ul class="nav nav-drawer">
                        <li class="nav-item active"><a href="user_list.html"><i class="mdi mdi-home"></i>
                            用户管理</a></li>
                        <li class="nav-item active"><a href="singer_list.html"><i class="mdi mdi-home"></i>
                            歌手管理</a></li>
                        <li class="nav-item active"><a href="musicList_list.html"><i class="mdi mdi-home"></i>
                            歌单管理</a></li>
                    </ul>
                </nav>
            </div>

        </aside>
        <!--End 左侧导航-->
        <!--头部信息-->
        <div id="header"></div>
        <!--End 头部信息-->
        <!-- 主题内容 -->
        <!--页面主要内容 table table-striped table-hover-->
        <main class="lyear-layout-content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="card">
                            <div class="card-toolbar clearfix">
                                <div class="toolbar-btn-action">
                                    <a class="btn btn-success m-r-5" id="open" href="#!"><i class="mdi mdi-check"></i>
                                        启用</a>
                                    <a class="btn btn-warning m-r-5" id="updateComments" href="javascript:;"><i
                                            class="mdi mdi-block-helper"></i> 禁用</a>
                                    <a class="btn btn-danger" id="deleteUsers"><i class="mdi mdi-window-close"></i>
                                        删除</a>
                                </div>
                            </div>
                            <div class="card-body">
                                <form id="updateForm">
                                    <div class="table-responsive">
                                        <table class="table table-bordered">
                                            <thead>
                                            <tr>
                                                <th>
                                                    <label class="lyear-checkbox checkbox-primary">
                                                        <input type="checkbox" id="check-all"><span></span>
                                                    </label>
                                                </th>
                                                <th>编号</th>
                                                <th>用户名</th>
                                                <th>用户密码</th>
                                                <th>邮箱</th>
                                                <th>性别</th>
                                                <th>电话</th>
                                                <th>VIP状态</th>
                                                <th>VIP码</th>
                                                <th>评论权限</th>
                                                <th>操作</th>
                                            </tr>
                                            </thead>
                                            <tbody  id="navul">
                                            </tbody>
                                        </table>
                                    </div>
                                </form>

                                <div>
                                    <ul id="pageUl" class="pagination">
                                        <li><a href="">首页</a></li>
                                        <li class="threeword"><a href="#">上一页</a></li>
                                        <li><a href="#">1</a></li>
                                        <li><a href="#">2</a></li>
                                        <li><a href="#">3</a></li>
                                        <li><a href="#">4</a></li>
                                        <li><a href="#">5</a></li>
                                        <li><a href="#">6</a></li>
                                        <li><a href="#">7</a></li>
                                        <li><a href="#">8</a></li>
                                        <li><a href="#">9</a></li>
                                        <li><a href="#">10</a></li>
                                        <li class="threeword"><a href="javascript:;">下一页</a></li>
                                        <li class="threeword"><a href="javascript:;">末页</a></li>
                                    </ul>
                                    共<span id="totalPageSpan">12</span>页<span id="totalCountSpan">132</span>条
                                </div>
                            </div>
                        </div>
                    </div>

                </div>

            </div>

        </main>
        <!--End 页面主要内容-->
    </div>
</div>
</body>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../js/bootstrap.min.js"></script>
<script type="text/javascript" src="../js/perfect-scrollbar.min.js"></script>
<script type="text/javascript" src="../js/main.min.js"></script>
<!--导入布局js，共享header和footer-->
<script type="text/javascript" src="../js/include.js"></script>

</html>
